<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      // call apply bind
      var obj1 = {
        name: 'cxm',
        test: function (a, b, c) {
          console.log(this.name) //{name: 'cxm', test: ƒ}
          console.log('参数', a, b, c)
        },
      }
      var obj2 = {
        name: 'zll',
        test: function () {
          console.log(this.name) //{name: 'cxm', test: ƒ}
        },
      }

      // obj1.test()
      // obj2.test()

      // call 执行函数，并改变this执行为函数的第一个参数
      // 支持多个参数
      obj1.test.call(obj2, 1, 2, 3)

      // apply 执行函数，并改变this执行为函数的第一个参数
      // 支持两个参数，第二个参数为数组
      obj1.test.apply(obj2, [1, 2, 3])

      // bind 改变this指向为函数的第一个参数，不会自动执行函数
      // 支持多个参数
      var fun1 = obj1.test.bind(obj2, 1, 2, 3)
      console.log(fun1)
      fun1()
    </script>
  </body>
</html>
